


<template>
<div>
  <el-container>
  <el-button class="el-icon-circle-plus" size="mini" type="primary" @click="addEmp()">添加</el-button>
  <el-button class="el-icon-delete" size="mini" type="danger" @click="deleteAll()">批量删除</el-button>
</el-container>
  <el-table
    :data="tableData"
    stripe
    style="width: 100%">
    <el-table-column
      prop="id"
      label="编号"
      width="180">
    </el-table-column>
     <el-table-column
      prop="username"
      label="姓名"
      width="180">
    </el-table-column>
     <el-table-column
      prop="gender"
      label="性别"
      width="180">
    </el-table-column>
     <el-table-column
      prop="email"
      label="邮箱"
      width="180">
    </el-table-column>
     <el-table-column
      prop="telephone"
      label="电话"
      width="180">
    </el-table-column>
 
  </el-table>

     <el-pagination
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :current-page="currentPage4"
      :page-sizes="[2, 4, 6]"
      :page-size="4"
      layout="total, sizes, prev, pager, next, jumper"
      :total="total">
    </el-pagination>


  <el-dialog title="收货地址" :visible.sync="dialogFormVisible">
  <el-form :model="form">
    <el-form-item label="姓名" :label-width="formLabelWidth">
      <el-input v-model="form.name" autocomplete="off"></el-input>
    </el-form-item>
      <el-form-item label="密码" :label-width="formLabelWidth">
      <el-input  type="password" v-model="form.password" autocomplete="off"></el-input>
    </el-form-item>
    <el-form-item label="性别:" :label-width="formLabelWidth">
          <el-radio-group v-model="form.sex">
            <el-radio label="男">男</el-radio>
            <el-radio label="女">女</el-radio>
          </el-radio-group>
        </el-form-item>
          <el-form-item label="邮箱" :label-width="formLabelWidth">
      <el-input v-model="form.email" autocomplete="off"></el-input>
    </el-form-item>
    <el-form-item label="电话" :label-width="formLabelWidth">
      <el-input v-model="form.telephone" autocomplete="off"></el-input>
    </el-form-item>
    
  </el-form>
  <div slot="footer" class="dialog-footer">
    <el-button @click="dialogFormVisible = false">取 消</el-button>
    <el-button type="primary" @click="TuserAdd()">确 定</el-button>
  </div>
</el-dialog>
   </div>
</template>

 



  

<script>
import axios from 'axios';

  export default {
    data() {
      return {
          dialogTableVisible: false,
        dialogFormVisible: false,
        form: {
          name: '',
         password: '',
          sex: '',
          email: '',
          telephone: ''
        },
        formLabelWidth: '120px',
      tableData:[],
        currentPage4: 1, //当前页
        num:4,  //每页条数
        total:0,
        numshu:1,
     
      
        dialogFormVisible: false,
        formLabelWidth: '120px',
       
      }
    },
    methods: {
      TuserAdd(){
          axios.get("/api/TUserinsertSelective",{params:{
            username:this.form.name,
            password:this.form.password,
            gender:this.form.sex,
            email:this.form.email,
            telephone:this.form.telephone,
          }}).then(data=>{
                  this.$message({
                        type: 'success',
                        message: '添加成功!'
                     });
            })         

      },
     
     
      addEmp(){
  
     
        this.dialogFormVisible = true
        // this.form={}
        // this.dongtai={}
        //    this.bj="false"

      },
    
    
     
       onSubmit() {
         this.getEmpList()
      },
      getEmpList(){
              axios.get("/api/TuserAllList",{params:{"page":this.currentPage4,"num":this.num,"name":this.name}}).then(data=>{
                console.log(data.data)
              this.tableData=data.data.rows  //获取分页数据
              this.total=data.data.total     //获取总记录数

               setTimeout(() => {
          this.loading=false;
        }, 1000);
      })
      },
   
      handleSizeChange(val) {
        console.log("数据"+val)
        this.num=val
      
       this.getEmpList()
      },
      handleCurrentChange(val) {
        console.log("当前页"+val)
        this.currentPage4=val
        this.getEmpList()
         
        },
     

  
  
  },
      created(){
        this.getEmpList()
            
           
      }
  }
</script>